<!-- 专属指标列表 -->
<template>
	<div class="exclusive-indicator-list-container">
		<!-- 数据列表 -->
		<YdTable
			:formData="searchFormData"
			:tableConfig="tableConfig"
			:tableData="tableData.data"
			@sizeChangeHandler="handleQuery"
			@currentChangeHandler="handleQuery"
			@sortChangeHandler="handleQuery"
			@selectionChangeHandler="handlerSelectionChange"
		>
		</YdTable>

		<!-- 添加或修改对话框 -->
		<el-dialog :title="dialog.addOrUpdate.title" v-model="dialog.addOrUpdate.open" width="1000px" append-to-body center>
			<el-form ref="addOrUpdateForm" :model="dialog.addOrUpdate.form" :rules="dialog.addOrUpdate.rule" size="small" label-width="150px">
				<el-row :gutter="10">
					<el-col :span="12">
						<el-form-item label="标志名称" prop="name">
							<el-input maxlength="50" v-model="dialog.addOrUpdate.form.name" placeholder="请输入标志名称"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="来源" prop="source">
							<el-select v-model="dialog.addOrUpdate.form.source" placeholder="请选择来源" style="width: 100%">
								<el-option v-for="(option, index) in options.sourceOptions" :key="index" :label="option.label" :value="option.value"> </el-option>
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="10">
					<el-col :span="12">
						<el-form-item label="关键字" prop="keyword">
							<el-input maxlength="50" v-model="dialog.addOrUpdate.form.keyword" placeholder="请输入关键字"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="值类型" prop="keywordType">
							<el-select v-model="dialog.addOrUpdate.form.keywordType" placeholder="请选择值类型" style="width: 100%">
								<el-option v-for="(option, index) in options.valTypeOptions" :key="index" :label="option.label" :value="option.value"> </el-option>
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="10">
					<el-col :span="12">
						<el-form-item label="匹配符" prop="matchRegular">
							<el-input maxlength="100" v-model="dialog.addOrUpdate.form.matchRegular" placeholder="请输入匹配符"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="格式化串" prop="formatStr">
							<el-input maxlength="100" v-model="dialog.addOrUpdate.form.formatStr" placeholder="请输入格式化串"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="8">
						<el-form-item label="是否全量提取" prop="isFullExtraction">
							<el-radio-group v-model="dialog.addOrUpdate.form.isFullExtraction">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="是否保留原始数据" prop="isRetainOri">
							<el-radio-group v-model="dialog.addOrUpdate.form.isRetainOri">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="是否显示" prop="isShow">
							<el-radio-group v-model="dialog.addOrUpdate.form.isShow">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="8">
						<el-form-item label="是否交易标识" prop="isDeal">
							<el-radio-group v-model="dialog.addOrUpdate.form.isDeal">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="是否用户标识" prop="isUserFlag">
							<el-radio-group v-model="dialog.addOrUpdate.form.isUserFlag">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="是否渠道标识" prop="isChannel">
							<el-radio-group v-model="dialog.addOrUpdate.form.isChannel">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="8">
						<el-form-item label="是否区域标识" prop="isRegion">
							<el-radio-group v-model="dialog.addOrUpdate.form.isRegion">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="是否自定义返回码" prop="isCustomReqCode">
							<el-radio-group v-model="dialog.addOrUpdate.form.isCustomReqCode">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="是否营业厅" prop="isBusinessHallCode">
							<el-radio-group v-model="dialog.addOrUpdate.form.isBusinessHallCode">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="8">
						<el-form-item label="是否工号" prop="isOperatorCode">
							<el-radio-group v-model="dialog.addOrUpdate.form.isOperatorCode">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="是否手机号码" prop="isPhoneNumber">
							<el-radio-group v-model="dialog.addOrUpdate.form.isPhoneNumber">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="是否告警提示语" prop="isAlarm">
							<el-radio-group v-model="dialog.addOrUpdate.form.isAlarm">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item label="是否需要通过用户关联信息回填" prop="isBackFill">
							<el-radio-group v-model="dialog.addOrUpdate.form.isBackFill">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item label="是否关联指标" prop="relevanceType">
							<el-radio-group v-model="dialog.addOrUpdate.form.relevanceType">
								<el-radio-button :label="'0'">非关联指标</el-radio-button>
								<el-radio-button :label="'1'">是前端关联指标</el-radio-button>
								<el-radio-button :label="'2'">是后端关联指标</el-radio-button>
								<el-radio-button :label="'3'">是前后端关联指标</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item label="是否解码" prop="decodeType">
							<el-radio-group v-model="dialog.addOrUpdate.form.decodeType">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="'base64'">Base64解码</el-radio-button>
								<el-radio-button :label="'unicode'">Unicode解码</el-radio-button>
								<el-radio-button :label="'url'">url解码</el-radio-button>
								<el-radio-button :label="'url+unicode'">url+unicode解码</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="8">
						<el-form-item label="是否敏感信息" prop="isSensitiveInformation">
							<el-radio-group v-model="dialog.addOrUpdate.form.isSensitiveInformation" @change="sensitiveOptionChange">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :span="8" v-show="showSensitiveConfig">
						<el-form-item label="脱敏长度" prop="sensitiveLength">
							<el-input-number v-model="dialog.addOrUpdate.form.sensitiveLength" :precision="0" :min="1" :max="99999"> </el-input-number>
						</el-form-item>
					</el-col>
					<el-col :span="8" v-show="showSensitiveConfig">
						<el-form-item label="脱敏开始数值" prop="sensitiveStartValue">
							<el-input-number v-model="dialog.addOrUpdate.form.sensitiveStartValue" :precision="0" :min="1" :max="99999"> </el-input-number>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row v-show="showSensitiveConfig">
					<el-col :span="8">
						<el-form-item label="展示是否脱敏" prop="isShowSensitive">
							<el-radio-group v-model="dialog.addOrUpdate.form.isShowSensitive">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="导出是否脱敏" prop="isExportSensitive">
							<el-radio-group v-model="dialog.addOrUpdate.form.isExportSensitive">
								<el-radio-button :label="0">否</el-radio-button>
								<el-radio-button :label="1">是</el-radio-button>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<template #footer class="dialog-footer">
				<el-button type="primary" @click="handlerSubmit" :loading="dialog.addOrUpdate.btnLoading">确 定</el-button>
				<el-button @click="closeAddOrUpdateDialog">取 消</el-button>
			</template>
		</el-dialog>

		<!-- 专属指标导入弹出层 -->
		<el-dialog
			:key="importIndicatorDialogKey"
			:title="dialog.imp.title"
			v-model="dialog.imp.open"
			width="500px"
			:close-on-click-modal="false"
			center
			@closed="importIndicatorDialogKey -= 1"
		>
			<div style="text-align: center">
				<el-upload
					:ref="dialog.imp.ref"
					:headers="dialog.imp.headers"
					:action="dialog.imp.url"
					:data="{ resourceCode: resource.resourceCode }"
					drag
					:auto-upload="false"
					accept=".xls,.xlsx"
					:limit="dialog.imp.limit"
					:on-exceed="handlerUploadOnExceed"
					:on-success="handlerUploadOnSuccess"
					:on-error="handlerUploadOnError"
				>
					<el-icon><Upload /></el-icon>
					<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
				</el-upload>
			</div>
			<template #footer class="dialog-footer">
				<el-button type="primary" @click="downloadTemplate">下载模板</el-button>
				<el-button type="primary" @click="handlerImport">确 定</el-button>
				<el-button @click="closeImpDialog">取 消</el-button>
			</template>
		</el-dialog>

		<!-- 专属指标同步弹出层 -->
		<indicator-sync ref="indicatorSyncRef" @closedEvent="indicatorSyncClosed" :resource="resource" :key="indicatorSyncKey"> </indicator-sync>
	</div>
</template>

<script setup name="ExclusiveIndicatorList" lang="tsx">
import { indicatorManagementOptions } from '@/utils/management/commonOptions';
import { list, add, edit, remove } from '@/api/management/IndicatorManage/proprietaryIndicatorManage/manage/index';
import { download, importTemplate } from '@/api/management/IndicatorManage/proprietaryIndicatorManage/details';
import IndicatorSync from '../manage/indicatorSyncDialog.vue';
import { downloadFromBlob } from '@/utils/common';
import { ref, reactive, onMounted, getCurrentInstance, watch } from 'vue';
import useUserStore from '@/store/modules/userinfo';

const { proxy } = getCurrentInstance();
const props = defineProps({
	resource: {
		type: Object,
		default: () => {
			return {};
		},
	},
});

const addOrUpdateForm = ref();

// 专属指标同步组件key
const indicatorSyncKey = ref(0);
// 专属指标导入弹出层key
const importIndicatorDialogKey = ref(-1);
// 选项
let options = reactive(indicatorManagementOptions());
// 搜索表单数据
let searchFormData = reactive<FormModelType>({
	resourceCode: '',
	pageSize: 10,
	pageNum: 1,
	orderByColumn: 'updateTime',
	isAsc: 'desc',
});
// 列表配置
let tableConfig = reactive<TableConfigType>({
	columns: [
		{
			label: '标识名称',
			prop: 'name',
			width: 150,
			showOverFlowToolTip: true,
			fixed: 'left',
		},
		{
			label: '来源',
			prop: 'source',
			width: 150,
			showOverFlowToolTip: true,
			fixed: 'left',
		},
		{
			label: '关键字',
			prop: 'keyword',
			width: 150,
			showOverFlowToolTip: true,
			fixed: 'left',
		},
		{
			label: '值类型',
			prop: 'keywordType',
			width: 120,
			showOverFlowToolTip: true,
			fixed: 'left',
		},
		{
			label: '匹配符',
			prop: 'matchRegular',
			width: 150,
			showOverFlowToolTip: true,
			fixed: 'left',
		},
		{
			label: '格式化串',
			prop: 'formatStr',
			width: 150,
			showOverFlowToolTip: true,
			fixed: 'left',
		},

		{
			label: '最后同步时间',
			prop: 'synTime',
			width: 160,
			sortable: true,
			fixed: 'left',
		},
		{
			label: '最后修改时间',
			prop: 'updateTime',
			width: 160,
			sortable: true,
			fixed: 'left',
		},
		{
			label: '编码',
			prop: 'eiCode',
			width: 160,
		},
		{
			label: '显示',
			prop: 'isShow',
			width: 60,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
		{
			label: '交易标识',
			prop: 'isDeal',
			width: 90,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
		{
			label: '用户标识',
			prop: 'isUserFlag',
			width: 90,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
		{
			label: '渠道标识',
			prop: 'isChannel',
			width: 90,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
		{
			label: '区域标识',
			prop: 'isRegion',
			width: 90,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
		{
			label: '自定义返回码',
			prop: 'isCustomReqCode',
			width: 120,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
		{
			label: '营业厅标识',
			prop: 'isBusinessHallCode',
			width: 100,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
		{
			label: '工号',
			prop: 'isOperatorCode',
			width: 60,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
		{
			label: '手机号',
			prop: 'isPhoneNumber',
			width: 80,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
		{
			label: '告警提示',
			prop: 'isAlarm',
			width: 90,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
		{
			label: '需要通过用户关联信息回填',
			prop: 'isBackFill',
			width: 200,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},

		{
			label: '脱敏',
			prop: 'isSensitiveInformation',
			width: 60,
			render: (row: any, val: any) => {
				const valStr = formatterFn(val);
				if (row.isSensitiveInformation === 1) {
					const isShowSensitiveStr = row.isShowSensitive == 1 ? '是' : '否';
					const isExportSensitiveStr = row.isExportSensitive == 1 ? '是' : '否';
					return (
						<span>{valStr}</span>
						// <el-tooltip effect="dark" placement="top">
						// 	<span>{valStr}</span>
						// 	<template v-slots={content}>
						// 		<div>
						// 			脱敏长度：{row.sensitiveLength}
						// 			<br />
						// 			脱敏开始数值：{row.sensitiveStartValue}
						// 			<br />
						// 			展示是否脱敏：{isShowSensitiveStr}
						// 			<br />
						// 			导出是否脱敏：{isExportSensitiveStr}
						// 		</div>
						// 	</template>
						// </el-tooltip>
					);
				}
				return <div>{valStr}</div>;
			},
		},
		{
			label: '关联指标',
			prop: 'relevanceType',
			width: 150,
			formatter: (row: any, val: any) => {
				let obj = options.relevanceEffectOptions.find((item: any) => item.value === val);
				if (obj) {
					return obj.label;
				}
			},
		},
		{
			label: '解码',
			prop: 'decodeType',
			width: 150,
			formatter: (row: any, val: any) => {
				let obj = options.decodeEffectOptions.find((item: any) => item.value === Number(val));
				if (obj) {
					return obj.label;
				}
			},
		},
		{
			label: '保留原始数据',
			prop: 'isRetainOri',
			width: 120,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
		{
			label: '全量提取',
			prop: 'isFullExtraction',
			width: 90,
			formatter: (row: any, val: any) => {
				return formatterFn(val);
			},
		},
	],
	// 工具栏
	toolBar: [
		{ name: '新增', icon: 'yd-icon-plus', permi: ['indicator:management:add'], handler: () => handlerAdd() },
		{ name: '修改', icon: 'yd-icon-edit', disable: 'single', permi: ['indicator:management:edit'], handler: () => handlerEdit() },
		{ name: '删除', icon: 'yd-icon-delete', disable: 'multiple', permi: ['indicator:management:delete'], handler: () => handlerDelete() },
		{ name: '同步', icon: 'yd-icon-sync', disable: 'multiple', permi: ['indicator:management:sync'], handler: () => handlerSync() },
		{ name: '导入', icon: 'yd-icon-import', permi: ['indicator:detail:import'], handler: () => handlerImport() },
		{ name: '导出', icon: 'yd-icon-export', permi: ['indicator:detail:export'], handler: () => handlerDownload('专属指标列表') },
	],
	// 序号列左固定
	indexColumnFixed: 'left',
	// 开启复选框
	enableSelection: true,
	// 开启分页
	pagination: {
		pageNum: 1,
	},
	// 加载层
	loading: true,
});
// 列表数据
let tableData = reactive({
	data: [],
});
// 是否显示脱敏配置
const showSensitiveConfig = ref(false);
// 选择的行数据ids
const selectedIds = ref<any[]>([]);
// 选择的行数据
const selected = ref<any[]>([]);

// 导入表单的ref
const uploadRef = ref();

let dialog = reactive<anyObj>({
	addOrUpdate: {
		// 打开状态
		open: false,
		// 标题
		title: '',
		// 表单数据
		form: {},
		// 按钮加载中状态
		btnLoading: false,
		// 表单校验规则
		rule: {
			name: [{ required: true, message: '标志名称不能为空', trigger: 'blur' }],
			source: [{ required: true, message: '来源必选', trigger: 'change' }],
			keywordType: [{ required: true, message: '值类型必选', trigger: 'change' }],
			matchRegular: [{ required: true, message: '匹配符不能为空', trigger: 'change' }],
		},
	},
	imp: {
		url:  import.meta.env.DEV ? import.meta.env.VITE_APP_BASE_API + '/management/exclusiveIndicator/import' : '/management/exclusiveIndicator/import',
		// ref
		ref: 'uploadRef',
		// 打开状态
		open: false,
		// 标题
		title: '导入',
		// 上传请求头
		headers: {
			Authorization: 'Bearer ' + useUserStore().access_token,
		},
		// 最多导入数
		limit: 1,
	},
});
watch(
	() => props.resource,
	(newval) => {
		console.log('watch', props.resource);
		searchFormData.resourceCode = props.resource.resourceCode;
		searchFormData.identifyStr = props.resource.identifyStr;

		console.log('watch', searchFormData);
		handleQuery();
	},
	{ deep: true }
);

onMounted(() => {
	// searchFormData.resourceCode = props.resource.resourceCode;
	// searchFormData.identifyStr = props.resource.identifyStr;
	// console.log('props.resource', props.resource);
	// handleQuery();
});

function formatterFn(val: any) {
	if (val === 0) {
		return '否';
	} else if (val === 1) {
		return '是';
	} else {
		return '-';
	}
}

/**
 * 关闭新增或修改弹出层
 */
function closeAddOrUpdateDialog() {
	dialog.addOrUpdate.open = false;
}
/**
 * 选择行数据
 */
function handlerSelectionChange(selects: any) {
	selectedIds.value = selects.map((item: any) => item.id);
	selected.value = selects;
}
/**
 * 搜索
 */
function handleQuery() {
	tableConfig.loading = true;
	list(searchFormData).then((res: ApiResponse) => {
		tableConfig.loading = false;
		if (res.code !== 0) {
			return;
		}
		if (res.data !== null) {
			tableData.data = res.data.records;
			tableConfig.pagination!.total = res.data.total;
		}
	});
}
/**
 * 下载(导出)
 */
function handlerDownload(fileName: string) {
	const d = JSON.parse(JSON.stringify(searchFormData));
	d.pageNum = 1;
	d.pageSize = 1000000;
	d.resourceCodes = [d.resourceCode];
	delete d.resourceCode;
	let params = {
		resourceCodes: searchFormData.resourceCode,
	};
	download(d).then((res) => {
		downloadFromBlob(res, fileName).then((o) => {
			if (!o.flag) {
				proxy.$modal.msgWarning(o.msg);
			}
		});
	});
}
/**
 * 导入
 */
function handlerImport() {
	// 判断窗口是否打开
	if (!dialog.imp.open) {
		dialog.imp.open = true;
		return;
	}
	proxy.$refs[dialog.imp.ref].submit();
}
/**
 * 上传超过最大限度时
 */
function handlerUploadOnExceed() {
	proxy.$modal.msgWarning('最多上传' + dialog.imp.limit + '个文件');
}
/**
 * 关闭导入弹出层
 */
function closeImpDialog() {
	dialog.imp.open = false;
}
/**
 * 表单提交
 */
function handlerSubmit() {
	if (dialog.addOrUpdate.title === '新增') {
		handlerAdd();
	} else {
		handlerEdit();
	}
}
// 重写新增方法
function handlerAdd() {
	// 判断窗口是否打开
	if (!dialog.addOrUpdate.open) {
		// 表单重置
		dialog.addOrUpdate.form = {
			isFullExtraction: 0,
			isRetainOri: 0,
			isShow: 0,
			isDeal: 0,
			isUserFlag: 0,
			isChannel: 0,
			isRegion: 0,
			isCustomReqCode: 0,
			isBusinessHallCode: 0,
			isOperatorCode: 0,
			isPhoneNumber: 0,
			isAlarm: 0,
			isBackFill: 0,
			relevanceType: 0,
			decodeType: 0,
			isSensitiveInformation: 0,
			sensitiveLength: 1,
			sensitiveStartValue: 1,
			isShowSensitive: 0,
			isExportSensitive: 0,
			resourceCode: props.resource.resourceCode,
			identifyStr: props.resource.identifyStr,
		};
		// 重置是否显示脱敏配置
		showSensitiveConfig.value = false;
		// 标题
		dialog.addOrUpdate.title = '新增';
		// 打开窗口
		dialog.addOrUpdate.open = true;
		return;
	}
	// 校验参数
	addOrUpdateForm.value?.validate((valid: any) => {
		if (!valid) {
			return;
		}
		// 设置标识属性
		const f = dialog.addOrUpdate.form;
		// 是否显示
		// dialog.addOrUpdate.form.isShow = f.show === 1 ? '1' : '0';
		// 是否交易标识
		// dialog.addOrUpdate.form.isTransIds = f.deal === 1 ? '1' : '0';
		// 是否关联指标
		// dialog.addOrUpdate.form.relevanceType = f.relevanceType;
		// dialog.addOrUpdate.form = {
		// 	...dialog.addOrUpdate.form,
		// 	isShow: f.isShow,
		// 	isDeal: f.isDeal,
		// 	isUserFlag: f.isUserFlag,
		// 	isChannel: f.isChannel,
		// 	isRegion: f.isRegion,
		// 	isCustomReqCode: f.isCustomReqCode,
		// 	isBusinessHallCode: f.isBusinessHallCode,
		// 	isOperatorCode: f.isOperatorCode,
		// 	isPhoneNumber: f.isPhoneNumber,
		// 	isAlarm: f.isAlarm,
		// 	isBackFill: f.isBackFill,
		// 	relevanceType: f.relevanceType,
		// 	decodeType: f.decodeType,
		// };
		// 调用接口
		dialog.addOrUpdate.btnLoading = true;
		add(dialog.addOrUpdate.form)
			.then((res: ApiResponse) => {
				dialog.addOrUpdate.btnLoading = false;
				if (res.code !== 0) {
					proxy.$modal.msgError(res.msg);
					return;
				}
				// 关闭弹出层
				closeAddOrUpdateDialog();
				// 刷新列表
				searchFormData.pageNum = 1;
				handleQuery();
				// 提示
				proxy.$modal.msgSuccess('新增成功！');
			})
			.catch((err: any) => {
				dialog.addOrUpdate.btnLoading = false;
			});
	});
}
// 重写修改方法
function handlerEdit() {
	// 打开窗口
	if (!dialog.addOrUpdate.open) {
		// 数据回显，数据需要拷贝一下
		const d = JSON.parse(JSON.stringify(selected.value[0]));
		dialog.addOrUpdate.form = {
			// ...d.effectAttrMap,
			...d,
		};
		// 回显是否显示脱敏配置
		showSensitiveConfig.value = dialog.addOrUpdate.form.isSensitiveInformation === 1;
		// 标题
		dialog.addOrUpdate.title = '修改';
		// 打开窗口
		dialog.addOrUpdate.open = true;
		return;
	}
	// 设置标识属性
	const f = dialog.addOrUpdate.form;
	// 是否显示
	// dialog.addOrUpdate.form.isShow = f.show === 1 ? '1' : '0';
	// 是否交易标识
	// dialog.addOrUpdate.form.isTransIds = f.deal === 1 ? '1' : '0';
	// 是否关联指标
	// dialog.addOrUpdate.form.isRelevance = f.relevanceType;
	// dialog.addOrUpdate.form = {
	// 	...dialog.addOrUpdate.form,
	// 	isShow: f.isShow,
	// 	isDeal: f.isDeal,
	// 	isUserFlag: f.isUserFlag,
	// 	isChannel: f.isChannel,
	// 	isRegion: f.isRegion,
	// 	isCustomReqCode: f.isCustomReqCode,
	// 	isBusinessHallCode: f.isBusinessHallCode,
	// 	isOperatorCode: f.isOperatorCode,
	// 	isPhoneNumber: f.isPhoneNumber,
	// 	isAlarm: f.isAlarm,
	// 	isBackFill: f.isBackFill,
	// 	relevanceType: f.relevanceType,
	// 	decodeType: f.decodeType,
	// };
	// 校验参数
	addOrUpdateForm.value?.validate((valid: any) => {
		if (!valid) {
			return;
		}
		// 调用接口
		dialog.addOrUpdate.btnDisabled = true;
		edit(dialog.addOrUpdate.form).then((res) => {
			dialog.addOrUpdate.btnDisabled = false;
			if (res.code !== 0) {
				proxy.$modal.msgError(res.msg);
				return;
			}
			// 关闭弹出层
			closeAddOrUpdateDialog();
			// 刷新列表
			searchFormData.pageNum = 1;
			handleQuery();
			// 提示
			proxy.$modal.msgSuccess('修改成功！');
		});
	});
}
/**
 * 删除
 */
function handlerDelete() {
	proxy.$modal
		.confirm('是否确认删除所选项?', '警告', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			type: 'warning',
		})
		.then(() => {
			// 调用接口
			return remove(selectedIds.value);
		})
		.then(() => {
			// 刷新列表 计算是否要查询上一页的数据
			if (tableConfig.pagination!.total && searchFormData.pageSize) {
				// 删除后的总条数
				let totalCount = tableConfig.pagination!.total - selectedIds.value.length;
				// 计算删除后的总页数
				let totalPage = Math.ceil(totalCount / searchFormData.pageSize);
				// 如果删除后的总页数小于1, 置为1
				totalPage = totalPage < 1 ? 1 : totalPage;
				// 判断删除前的页数是否大于删除后的总页数, 计算当前页应该是多少赋值给查询表单
				searchFormData.pageNum = searchFormData.pageNum > totalPage ? totalPage : searchFormData.pageNum;
			} else {
				searchFormData.pageNum = 1;
			}
			handleQuery();
			// 提示
			proxy.$modal.msgSuccess('删除成功！');
		});
}
// 脱敏配置选项
function sensitiveOptionChange(val: any) {
	if (val === 1) {
		showSensitiveConfig.value = true;
	} else {
		showSensitiveConfig.value = false;
	}
}
// 同步
function handlerSync() {
	console.log('selected', selected);
	console.log('selected', selected.value[0]);
	const id = selected.value[0].resourceCode;
	proxy.$refs.indicatorSyncRef.openDialog(selectedIds.value, id);
}
// 同步弹窗关闭回调
function indicatorSyncClosed() {
	indicatorSyncKey.value += 1;
}
// 下载导入模板
function downloadTemplate() {
	importTemplate().then((res) => {
		downloadFromBlob(res, '专属指标导入模板').then((o) => {
			if (!o.flag) {
				proxy.$modal.msgWarning(o.msg);
			}
		});
	});
}
// 导入成功
function handlerUploadOnSuccess(res: any) {
	if (res.code !== 0) {
		proxy.$modal.msgWarning(res.msg);
		uploadRef.value?.clearFiles();
		return;
	}
	dialog.imp.open = false;
	handleQuery();
	proxy.$modal.msgSuccess(res.data);
}
// 导入失败
function handlerUploadOnError() {
	dialog.imp.open = false;
	proxy.$modal.msgError('导入失败');
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped></style>
